import { Card, Layout, Typography } from 'antd'
import React, { useEffect, useState } from 'react'
import store from 'store'

import type { User } from '@/types/user'

const EMPTY_USER: User = {
  nickname: 'Guest',
  id: 0,
  username: 'guest',
  roles: [],
  permissions: []
};

const HomePage = () => {
  const [currentUser, setCurrentUser] = useState<User>(EMPTY_USER)
  useEffect(() => {
    const user = store.get('current_user');
    if (user) {
      setCurrentUser({ ...EMPTY_USER, ...user }); // 合并确保字段完整
    }
  }, [])

  return (
    <Layout style={{ padding: '24px' }}>
      <Card>
        <Typography.Title level={4}>欢迎使用Void Dashboard</Typography.Title>
        <Typography.Paragraph>
          您好！ <span className="font-bold text-blue-600">{currentUser.nickname}</span>
        </Typography.Paragraph>
      </Card>
    </Layout>
  )
}

export default HomePage
